// 抽象选项卡类
function Tab(btns, contents) {
    // 属性 有 选项卡的 按钮 和 选项卡显示的内容  
    this.btns = btns;
    this.contents = contents;
    this.btnsFor();
}

Tab.prototype.btnsFor = function () {
    var that = this;
    this.btns.forEach(function (btn, k) {
        btn.onclick = function () {
            console.log("点击了");
            // 切换按钮的类名样式 ；
            that.addBtnClass(k);
            that.switchContent(k);
        }
    })
}

Tab.prototype.addBtnClass = function (k) {
    this.btns.forEach(function (val, kk) {
        if (kk == k) {
            val.classList.add("active");
        } else {
            val.classList.remove("active");
        }
    })
}

Tab.prototype.switchContent = function (k) {
    this.contents.forEach(function (item, key) {
        if (key == k) {
            item.classList.add("active");
            item.style.display = "block";
        } else {
            item.classList.remove("active");
            item.style.display = "none";
        }
    })
}
